<?xml version="1.0" encoding="ISO-8859-1" ?>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<!DOCTYPE html >
<html>
<head>
<meta charset="utf-8">
<title>Trastienda</title>
<link href="css/style.css" rel="stylesheet" />
<script src="js/jquery-1.7.2.min.js" type="text/javascript"
	charset="utf-8"></script>
<script src="js/jquery.bxSlider.min.js" type="text/javascript"
	charset="utf-8"></script>

<script type="text/javascript">
	$(document).ready(function() {
		$('#sliderN').bxSlider({
			auto : true,
			autoControls : false,
			controls : false
		});
	});
</script>



<script type="text/javascript">
	function doAjaxProd() {
		// get the form values

		var nombres = $("#prod_name").val();

		$.getJSON("ListProd.html", {
			nombre : nombres
		},

		function(data) {
			//alert(data.length);		
			$('#listado_productos').empty();
			for ( var i = 0; i < data.length; i++) {
				$('#listado_productos').append(
						'<div class="prod_box">' +
						'<div class="center_prod_box">' +
						'<div class="product_title">'+
						data[i].nombre +
						'</div>'+
						'<div class="product_img">'+
						'<img src="images/'+data[i].imagen+'.jpg" alt="" title="" border="0" width="100" />'+
						'</div>'+
						'<div class="prod_price">'+
						'<span class="reduce">$'+
						data[i].precio +
						'</span>'+
						'<span class="price"> $'+
						(data[i].precio-20)+
						'</span>'+
						'</div>'+									
						'</div>'+
						'<div class="prod_details_tab">'+
						'<a href="" class="prod_buy">+ Carrito</a> <a href="" class="prod_details">Detalles</a>'+
						'</div>'+
								'</div>');
			}

		});
	}
</script>

<script type="text/javascript">
	function doAjaxCat(cat) {
		// get the form values

		//alert(cat);

		$.getJSON("ListProdCat.html", {
			categoria : cat
		},

		function(data) {
			//alert(data.length);		
			$('#listado_productos').empty();
			for ( var i = 0; i < data.length; i++) {
				$('#listado_productos').append(
						'<div class="prod_box">' +
						'<div class="center_prod_box">' +
						'<div class="product_title">'+
						data[i].nombre +
						'</div>'+
						'<div class="product_img">'+
						'<img src="images/'+data[i].imagen+'.jpg" alt="" title="" border="0" width="100" />'+
						'</div>'+
						'<div class="prod_price">'+
						'<span class="reduce">$'+
						data[i].precio +
						'</span>'+
						'<span class="price"> $'+
						(data[i].precio-20)+
						'</span>'+
						'</div>'+									
						'</div>'+
						'<div class="prod_details_tab">'+
						'<a href="" class="prod_buy">+ Carrito</a> <a href="" class="prod_details">Detalles</a>'+
						'</div>'+
								'</div>');
			}

		});
	}
</script>



</head>
<body>

	<%@include file="header.jsp"%>
	<%@include file="sidebarLeft.jsp"%>

	<div class="center_content">


		<!-- Begin Slider -->
		<div id="sliderN">

			<c:forEach items="${requestScope.ESPECIAL2}" var="sp2" varStatus="i">
			<div>
				<div class="oferta">
					<img src="images/${sp2.imagen}.jpg" width="160" height="140" border="0"
						class="oferta_img" alt="" />
					<div class="oferta_details">
						<div class="oferta_title">${sp2.nombre}</div>
						<div class="oferta_text">${sp2.descripcion}</div>
						<a href="#" class="prod_buy">detalles</a>
					</div>
				</div>
			</div> </c:forEach>

		</div>



		<!-- End Slider -->

		<div class="center_title_bar">Productos</div>
		<div id="listado_productos">

			<c:forEach items="${requestScope.PRODUCTOS}" var="r" varStatus="i">
				<div class="prod_box">

					<div class="center_prod_box">
						<div class="product_title">
							<a href="">${r.nombre}</a>
						</div>
						<div class="product_img">
							<a href=""><img src="images/${r.imagen}.jpg" alt="" title=""
								border="0" width="100" /></a>
						</div>
						<div class="prod_price">
							<span class="reduce">${r.precio}</span> <span class="price">${r.precio-20}</span>
						</div>
					</div>

					<div class="prod_details_tab">
						<a href="" class="prod_buy">+ Carrito</a> <a href=""
							class="prod_details">Detalles</a>
					</div>
				</div>
			</c:forEach>
		</div>



	</div>
	<!-- end of center content -->


	<%@include file="sidebarRight.jsp"%>
	<%@include file="footer.jsp"%>


</body>
</html>
